<!DOCTYPE html>
  <html>
  <head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
      <title>个人信息</title>
      <script type="text/javascript" src="../../script/api.js"></script>
      <script type="text/javascript" src="../../script/doT.min.js"></script>
      <link rel="stylesheet" type="text/css" href="../../css/api.css"/>
      <style>
          body{
            background-color: #fcfcfc;
            height:100%;
            padding-top:40px;
          }
          a{color: #000;text-decoration: none;}
          .top{
            width: 100%;height:40px;background-color: #f5f5f5;
            line-height: 40px;
          }
          .leftreturn{
            width:25px;
            height:25px;
            margin:7.5px;
            float: left;
          }
          .header{ width:100%;height:100px;text-align:center;}
          .header img{width:100px; height:100px;border-radius: 50px;border: none;margin:0px auto;}
          .table1{width:100%;border:0; cellspacing:0; cellpadding:0; }
          .table1 tr td{padding:0px;}
          .td1{width:30%;font-size: 18px;height:35px;line-height: 35px;margin-right: 50px;border-bottom:solid 1px #ced9df;}
          .td2{width:70%;font-size: 18px;height:35px;border-bottom:solid 1px #ced9df;line-height: 35px;}
      </style>
  </head>
  <body>
    <div id="content">
    <script type="text/x-dot-template"id="tmpl-2">
    <div class="top">
      <img src="../../image/leftreturn.png" alt="" class="leftreturn" onclick="Winclose();">
      <span>个人信息</span>
    </div>
    <div class="header">
    {{? it[0].Headpicture!=null}}
      <img src="{{=it[0].Headpicture.url}}" alt="" onClick="change_user()">
      {{??}}
      <img src="../../image/sxlogo.png" alt="" onClick="change_user()">
      {{?}}
    </div>
    <div class="main">
      <table class="table1">
        <tr>
          <td  class="td1" id="name">&nbsp&nbsp昵称</td>
          <td   class=td2>{{=it[0].username}}</td>
        </tr>
        {{? it[0].mobile==null}}
        <tr>
          <td  class="td1">&nbsp&nbsp电话号码</td>
          <td   class=td2>未填写，请点击头像修改个人信息</td>
        </tr>
        {{??}}
          <td  class="td1">&nbsp&nbsp电话号码</td>
          <td   class=td2>{{=it[0].mobile}}</td>
        {{?}}
        {{? it[0].email!=''}}
        <tr>
          <td  class="td1">&nbsp&nbsp邮箱</td>
          <td   class=td2>{{=it[0].email}}</td>
        </tr>
        {{??}}
        <tr>
          <td  class="td1">&nbsp&nbsp邮箱</td>
          <td   class=td2>未填写，请点击头像修改个人信息</td>
        </tr>
        {{?}}
        <tr>
          <td  class="td1">&nbsp&nbsp微信</td>
        {{? it[0].wxbound}}
          <td  class=td2>已绑定<a style="float:right;line-height:35px;margin-right:15px;" href="#" onclick="error();">></a></td>
        {{??}}
          <td  class=td2>未绑定<a style="float:right;line-height:35px;margin-right:15px;" href="#" onclick="error();">></a></td>
        {{?}}
        </tr>
        <tr>
          <td  class="td1">&nbsp&nbsp支付宝</td>
          {{? it[0].zfbbound}}
          <td   class=td2>已绑定<a style="float:right;line-height:35px;margin-right:15px;" href="#" onclick="error();">></a></td>
          {{??}}
          <td   class=td2>未绑定<a style="float:right;line-height:35px;margin-right:15px;" href="#" onclick="error();">></a></td>
          {{?}}
        </tr>
        <tr>
          <td  class="td1">&nbsp&nbsp实名认证</td>
          {{? it[0].realbound}}
          <td   class=td2>已实名认证<a style="float:right;line-height:35px;margin-right:15px;" href="#" onclick="error();">></a></td>
           {{??}}
          <td   class=td2>未实名认证<a style="float:right;line-height:35px;margin-right:15px;" href="#" onclick="error();">></a></td>
          {{?}}
        </tr>
      </table>
    </div>
    </script>
   </div>
  </body>

  <script type="text/javascript">
        apiready = function(){
          var user = $api.getStorage('user');
          //将用户名放入html中
          $api.html(document.getElementById('name'),user[0].username)


          //使用doT模板将用户信息放入html中
          // 编译模板函数
          tmpltxt=doT.template(document.getElementById("tmpl-2").innerHTML);//生成模板方法
          document.getElementById("content").innerHTML=tmpltxt(user);//数据渲染

          init_listenevent();
        }

        function Winclose() {
      		api.closeWin();
      	}

        function change_user(){

          api.openWin({
              name: 'edituserinfor',
              url: './edituserinfor.html'
          });
        }

        function init_listenevent(){
          api.addEventListener({
              name: 'updateuser'
          }, function(ret, err){
              if( ret ){
                //使用doT模板将用户信息放入html中
                // 编译模板函数
                tmpltxt=doT.template(document.getElementById("tmpl-2").innerHTML);//生成模板方法
                document.getElementById("content").innerHTML=tmpltxt(ret.value.user);//数据渲染
              }else{
                   alert("数据库连接失败");
              }
          });
        }

        function error(){
          alert("该功能还未实现，敬请期待！！");
        }
  </script>
  </html>
